<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

<div class="main-content">
    <div class="box box-main">
        <form id="inputForm" model="post" action="<c:url value="/web/admin/systemUser/executeSystemUserEdit.action"/>" method="post" class="form-horizontal">
            <div class="box-body">
                <div class="form-unit">基本信息</div>
                <input id="userId" name="id" value="${systemUser.id}" type="hidden">
                <div class="row">
                    <div class="col-xs-6">
                        <div class="form-group">
                            <label class="control-label col-sm-4" title="">
                                <span class="required ">*</span> 账号：<i class="fa icon-question hide"></i></label>
                            <div class="col-sm-8">
                                <input path="userAccount" name="userAccount" value="${systemUser.userAccount}" maxlength="100" class="form-control required "/>
                            </div>
                        </div>
                    </div>
                    <div class="col-xs-6">
                        <div class="form-group">
                            <label class="control-label col-sm-4" title="">
                                <span class="required ">*</span> 密码：<i class="fa icon-question hide"></i></label>
                            <div class="col-sm-8">
                                <input path="userPassword" name="userPassword" maxlength="64" value="${systemUser.userPassword}" class="form-control required abc"/>
                            </div>
                        </div>
                    </div>
                    <div class="col-xs-6">
                        <div class="form-group">
                            <label class="control-label col-sm-4" title="">
                                <span class="required">*</span> 姓名：<i class="fa icon-question hide"></i></label>
                            <div class="col-sm-8">
                                <input path="userName" name="userName" maxlength="100" value="${systemUser.userName}" class="form-control required "/>
                            </div>
                        </div>
                    </div>
                    <div class="col-xs-6">
                        <div class="form-group">
                            <label class="control-label col-sm-4" title="">
                                <span class="required hide">*</span> 工号：<i class="fa icon-question hide"></i></label>
                            <div class="col-sm-8">
                                <input path="workNo" name="workNo" maxlength="100" value="${systemUser.workNo}" class="form-control "/>
                            </div>
                        </div>
                    </div>
                    <div class="col-xs-6">
                        <div class="form-group">
                            <label class="control-label col-sm-4" title="">
                                <span class="required">*</span> 角色：<i class="fa icon-question hide"></i></label>
                            <div class="col-sm-8">
                                <input path="select_role" id="select_role" name="select_role" class="form-control required">
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="box-body">
                <div class="form-unit">选择账号类型</div>
                <div class="row" style="margin:0!important;">
                    <div>
                        <div class="ibox tabs-container ibox-content">
                            <label class="radio-inline">
                                <input type="radio" checked="" value="Super" id="role1" name="operationRole" onclick="changeContent('Super')">平台管理员</label>
                            <label class="radio-inline">
                                <input type="radio" value="Enterprise" id="role2" name="operationRole" onclick="changeContent('Enterprise')">企业管理员</label>
                            <label class="radio-inline">
                                <input type="radio" value="Project" id="role3" name="operationRole" onclick="changeContent('Project')">项目管理员</label>
                            <label class="radio-inline">
                                <input type="radio" value="Ordinary" id="role4" name="operationRole" onclick="changeContent('Ordinary')">普通用户</label>
                        </div>
                        <div style="margin-top: 10px;min-height: 100px;">
                            <div class="ibox tabs-container ibox-content hide" id="EnterpriseContent">
                                <input path="select_enterprise" id="select_enterprise" name="select_enterprise" class="form-control">
                            </div>
                            <div class="ibox tabs-container ibox-content hide" id="ProjectContent">
                                <div id="menuTrees" class="select-width10"></div>
                                <input type="hidden" name="treesData" id="treesData" value=""/>
                                <script id="menuTpl" type="text/template">
                                    <div class="pull-center" style="padding:0 15px;min-width:300px;">
                                        <div class="box box-solid" style="background:#FAFAFA">
                                            <div class="box-header">
                                                <div class="box-title icheck">
                                                    <label><input type="checkbox" id="checkall_{{d.key}}"
                                                                  class="checkall"/> 全部</label>
                                                </div>
                                                <div class="box-tools pull-right" style="top:8px;">
                                                    <a class="btn btn-box-tool" id="expand_{{d.key}}"
                                                       value="menuTree_{{d.key}}">展开</a>/<a
                                                        class="btn btn-box-tool" id="collapse_{{d.key}}"
                                                        value="menuTree_{{d.key}}">折叠</a>
                                                </div>
                                            </div>
                                            <div class="box-body">
                                                <div id="menuTree_{{d.key}}" class="ztree"></div>
                                            </div>
                                        </div>
                                    </div>
                                </script>
                            </div>
                            <div class="ibox tabs-container ibox-content hide" id="OrdinaryContent">
                                <script id="ordinaryTpl" type="text/template">
                                    <div id="ordinary_all_{{d.key}}">
                                        <div class="select-width10 float-left select-top1" id="enterprise_{{d.key}}">
                                            <div class="select-width1 select-top1 float-left">
                                                企业{{d.key}}：
                                            </div>
                                            <div class="select-width5 float-left select-left0_5">
                                                <input path="select_role" id="company_{{d.key}}" class="form-control select-width10">
                                            </div>
                                            <div class="select-width2 float-left">
                                                <i class="select-left1"></i>
                                                <a href="#" class="btn btn-sm btn-default" title="新增" onclick="addEnterprise()"><i class="fa fa-plus"></i></a>
                                                <a href="#" class="btn btn-sm btn-default" title="删除" onclick="removeEnterprise(this)"><i class="fa fa-minus"></i></a>
                                            </div>
                                        </div>
                                        <div class="select-width10 float-left select-top1">
                                            <div class="select-width1 select-top1 float-left">
                                                项目{{d.key}}：
                                            </div>
                                            <div class="select-width17 float-left select-left0_5">
                                                <input id="company_1" class="form-control select-width10">
                                            </div>
                                            <div class="select-width17 float-left select-left0_5">
                                                <input path="select_role" id="company_2" class="form-control select-width10">
                                            </div>
                                            <div class="select-width17 float-left select-left0_5">
                                                <input path="select_role" id="company_3" class="form-control select-width10">
                                            </div>
                                            <div class="select-width17 float-left select-left0_5">
                                                <input path="select_role" id="company_4" class="form-control select-width10">
                                            </div>
                                            <div class="select-width2 float-left">
                                                <i class="select-left1"></i>
                                                <a href="#" class="btn btn-sm btn-default" title="新增"><i class="fa fa-plus"></i></a>
                                                <a href="#" class="btn btn-sm btn-default" title="删除" onclick="deleteRow()"><i class="fa fa-minus"></i></a>
                                            </div>
                                        </div>
                                    </div>
                                </script>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="box-footer">
                <div class="row">
                    <div class="col-sm-offset-2 col-sm-10">
                        <button type="submit" class="btn btn-sm btn-primary" id="btnSubmit"><i class="fa fa-check"></i> 保 存</button>&nbsp;

                        <button type="button" class="btn btn-sm btn-default" id="btnCancel" onclick="closeView()"><i class="fa fa-times"></i> 关 闭</button>
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>
<script>
    $("#inputForm").validate({
        submitHandler: function(form){
            js.ajaxSubmitForm($(form), function(data){
                js.showMessage(data.msg);
                if(data.status == Global.NO){
                    closeView();
                    $('#dataGrid').dataGrid("refresh");
                }
            }, "json");
        }
    });

    var select_modal = $('#select_role').magicSuggest({
        allowFreeEntries: false,
        data: '<c:url value="/web/admin/systemRole/getSystemRoleListMagic.action?id=${systemUser.systemRole.id}" />',
        queryParam: 'q',
        valueField: "value",
        displayField: "text",
        maxSelection: 1,
        noSuggestionText: '',
        placeholder: '请选择',
        required: true,
        autoSelect: true,
        selectFirst: true,
        value: magicSuggestValue('${systemUser.systemRole.id}')
    });

    var select_enterprise = $('#select_enterprise').magicSuggest({
        allowFreeEntries: false,
        data: '<c:url value="/web/admin/enterprise/getEnterpriseListMagic.action" />',
        queryParam: 'q',
        valueField: "value",
        displayField: "text",
        maxSelection: 1,
        noSuggestionText: '',
        placeholder: '选择企业',
        required: true,
        autoSelect: true,
        selectFirst: true,
        value: magicSuggestValue('')
    });

    $('#company_').magicSuggest({
        allowFreeEntries: false,
        data: '<c:url value="/web/admin/enterprise/getEnterpriseListMagic.action" />',
        queryParam: 'q',
        valueField: "value",
        displayField: "text",
        maxSelection: 1,
        noSuggestionText: '',
        placeholder: '选择企业',
        required: true,
        autoSelect: true,
        selectFirst: true,
        value: magicSuggestValue('')
    });

    function closeView() {
        layer.close(LayWin['wSystemUser']);
    }

    function changeContent(index) {
        var _this=$("#"+index+"Content");
        hideAllContent();
        _this.removeClass("hide");
    }

    function hideAllContent() {
        if(!$("#EnterpriseContent").hasClass("hide")){
            $("#EnterpriseContent").addClass("hide");
        }
        if(!$("#ProjectContent").hasClass("hide")){
            $("#ProjectContent").addClass("hide");
        }
        if(!$("#OrdinaryContent").hasClass("hide")){
            $("#OrdinaryContent").addClass("hide");
        }
    }

    //加载数据权限树结构
    var setting = {
        check: {enable: true, nocheckInherit: true, chkboxType: {"Y": "ps", "N": "ps"}},
        view: {selectedMulti: false, nameIsHTML: true},
        data: {simpleData: {enable: true}, key: {title: "title"}},
        callback: {
            beforeClick: function (treeId, treeNode, clickFlag) {
                var tree = $.fn.zTree.getZTreeObj(treeId);
                tree.checkNode(treeNode, !treeNode.checked, true, true);
                return false;
            },
            onCheck: function (event, treeId, treeNode) {
                var tid = treeNode.tId;
                if (!treeNode.checked) {
                    $(".checkall[value=" + treeId + "]").each(function () {
                        if (this.checked) {
                            $(this).removeAttr("checked").iCheck('update');
                        }
                        return false;
                    });
                }
            }
        }
    };

    var menuTrees = {}; // 用sysCode分类存储所有菜单树
    var code="project";
    $.ajax({
        type: 'POST',
        url: "<c:url value="/web/admin/project/getProjectTree.action"/>",
        data: {
            sysCode:code,
            userId:$("#userId").val()
        },
        dataType: 'json',
        async: false,
        error: function (data) {
            js.showErrorMessage(data.responseText);
        },
        success: function (html, status, xhr) {
            var data=html.data;
            for (var sysCode in data.menuMap) {
                var menuMap = data.menuMap[sysCode];
                $('#menuTrees').append(js.template('menuTpl', {
                    key: sysCode,
                    label: sysCode
                }));
                // 初始化树结构
                var tree = $.fn.zTree.init($("#menuTree_" + sysCode), setting, menuMap);
                // 展开第一级节点
                var nodes = tree.getNodesByParam("level", 0);
                for (var i = 0; i < nodes.length; i++) {
                    tree.expandNode(nodes[i], true, false, false);
                }
                // 展开第二级节点
                nodes = tree.getNodesByParam("level", 1);
                for (var i = 0; i < nodes.length; i++) {
                    tree.expandNode(nodes[i], true, false, false);
                }
                // 默认展开全部节点
                //tree.expandAll(true);
                // 树结构：全选、取消全选
                $('#checkall_' + sysCode).iCheck({
                    checkboxClass: 'icheckbox_minimal-grey'
                }).on('ifChecked ifUnchecked', function () {
                    var sysCode = $(this).attr('sysCode');
                    if (this.checked) {
                        menuTrees[sysCode].checkAllNodes(true);
                    } else {
                        menuTrees[sysCode].checkAllNodes(false);
                    }
                }).attr("sysCode", sysCode);
                // 展开和折叠按钮绑定
                $('#expand_' + sysCode).click(function () {
                    var sysCode = $(this).attr('sysCode');
                    menuTrees[sysCode].expandAll(true);
                }).attr("sysCode", sysCode);
                $('#collapse_' + sysCode).click(function () {
                    var sysCode = $(this).attr('sysCode');
                    menuTrees[sysCode].expandAll(false);
                }).attr("sysCode", sysCode);
                // 将树对象存储到全局数组里
                menuTrees[sysCode] = tree;
            }
            // 默认选择节点
            for (var idx in data.roleMenuList) {
                var roleMenu = data.roleMenuList[idx];
                var sysCode = roleMenu.sysCode;
                var node = menuTrees[sysCode].getNodeByParam("id", roleMenu.menuCode);
                try {
                    menuTrees[sysCode].checkNode(node, true, false);
                } catch (e) {
                }
            }
        }
    });

    //第二个树
    var organTrees = {};
    var organCode="organ";
    $.ajax({
        type: 'POST',
        url: "<c:url value="/web/admin/organization/getOrganizationTree.action"/>",
        data: {
            sysCode:organCode
        },
        dataType: 'json',
        async: false,
        error: function (data) {
            js.showErrorMessage(data.responseText);
        },
        success: function (html, status, xhr) {
            var data=html.data;
            for (var sysCode in data.menuMap) {
                var menuMap = data.menuMap[sysCode];
                $('#organTrees').append(js.template('organTpl', {
                    key: sysCode,
                    label: sysCode
                }));
                // 初始化树结构
                var tree = $.fn.zTree.init($("#organTree_" + sysCode), setting, menuMap);
                // 展开第一级节点
                var nodes = tree.getNodesByParam("level", 0);
                for (var i = 0; i < nodes.length; i++) {
                    tree.expandNode(nodes[i], true, false, false);
                }
                // 展开第二级节点
                nodes = tree.getNodesByParam("level", 1);
                for (var i = 0; i < nodes.length; i++) {
                    tree.expandNode(nodes[i], true, false, false);
                }
                // 默认展开全部节点
                //tree.expandAll(true);
                // 树结构：全选、取消全选
                $('#organCheckall_' + sysCode).iCheck({
                    checkboxClass: 'icheckbox_minimal-grey'
                }).on('ifChecked ifUnchecked', function () {
                    var sysCode = $(this).attr('sysCode');
                    if (this.checked) {
                        organTrees[sysCode].checkAllNodes(true);
                    } else {
                        organTrees[sysCode].checkAllNodes(false);
                    }
                }).attr("sysCode", sysCode);
                // 展开和折叠按钮绑定
                $('#organExpand_' + sysCode).click(function () {
                    var sysCode = $(this).attr('sysCode');
                    organTrees[sysCode].expandAll(true);
                }).attr("sysCode", sysCode);
                $('#organCollapse_' + sysCode).click(function () {
                    var sysCode = $(this).attr('sysCode');
                    organTrees[sysCode].expandAll(false);
                }).attr("sysCode", sysCode);
                // 将树对象存储到全局数组里
                organTrees[sysCode] = tree;
            }
            // 默认选择节点
            for (var idx in data.roleMenuList) {
                var roleMenu = data.roleMenuList[idx];
                var sysCode = roleMenu.sysCode;
                var node = organTrees[sysCode].getNodeByParam("id", roleMenu.menuCode);
                try {
                    organTrees[sysCode].checkNode(node, true, false);
                } catch (e) {
                }
            }
        }
    });

    function getData() {
        var treeData = new Array();
        var zTreeObj = $.fn.zTree.getZTreeObj("menuTree_" + code);
        var checkedNodes = zTreeObj.getCheckedNodes();
        $.each(checkedNodes, function (i, val) {
            if (val.type == "project") {
                treeData.push(val.id)
            }
        });
        $("#treesData").val(treeData);
    }

    function getOrganData() {
        var treeData = new Array();
        var zTreeObj = $.fn.zTree.getZTreeObj("organTree_" + organCode);
        var checkedNodes = zTreeObj.getCheckedNodes();
        $.each(checkedNodes, function (i, val) {
            if (val.type == "auth") {
                treeData.push(val.id)
            }
        });
        $("#organTreesData").val(treeData);
    }

    var ordinaryKey=1;
    var ordinaryLabel=1;
    $(document).ready(function(){
        addEnterprise();
    });

    function removeEnterprise(_this) {
        var input=$(_this).parent().parent().parent();
        input.remove();
    }
    function addEnterprise() {
        $('#OrdinaryContent').append(js.template('ordinaryTpl', {
            key: ordinaryKey,
            label: ordinaryLabel
        }));
        ordinaryKey++;
        ordinaryLabel++;
    }
</script>


